<template>
  <baseCard title="基础设施监控"
            :height="height"
            :contentStyle="{ paddingTop: '0', paddingRight: '0',marginLeft:'0.05rem' }">
    <div class="template">
      <overTemplate v-for="(item, index) in overviewData"
                    :key="index"
                    :itemData="item"></overTemplate>
      <infrastructureBootom v-for="(item, index) in overviewDataWarning"
                            :key="index"
                            :itemData="item"></infrastructureBootom>
    </div>
  </baseCard>
</template>

<script setup>
import { computed, ref } from "vue";
import baseCard from "@/components/vpt-cards-1001/index.vue";
import overTemplate from "@/components/vpt-over-template/indexnew.vue";
import infrastructureBootom from "@/components/vpt-infrastructure-bootom/index.vue";

const props = defineProps({
  height: { type: String, default: "" },
  overviewData: { type: Array, default: [] },
  overviewDataWarning: { type: Array, default: [] },
});
</script>

<style lang="less" scoped>
.template {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
</style>